<template>
  <el-container>

    <el-aside width="200px">
      <el-row>
        <el-col :span="24">
          <el-image style="
                  width: 120px;
                  height: 60px;
                  display: block;
                  margin: 40px auto;
                " fit="fill" :src="require('@/assets/image/main_logo.png')"></el-image>
          <el-menu active-text-color="#ffd04b" background-color="#191A22" class="el-menu-vertical-demo"
            default-active="2" text-color="#fff">
            <el-sub-menu index="1">
              <template #title>
                <el-icon></el-icon>
                <span>系统管理</span>
              </template>

              <el-menu-item  index="1-1"  @click="open('user')">
                用户管理</el-menu-item>
               <span v-hasPermissions="['system:menu']"> <el-menu-item index="1-2" @click="open('operLog')">
                日志管理</el-menu-item></span>
            </el-sub-menu>
            <el-menu-item index="2">
              <el-icon></el-icon>
              <span>系统监控</span>
            </el-menu-item>
          </el-menu>
        </el-col>
      </el-row>
    </el-aside>
    <el-container>
      <el-header>当前用户：{{userName}}<div><el-button @click="loginOut" type="danger">退出</el-button></div></el-header>
      <!--进行路由跳转-->
      <el-main>
        <router-view></router-view>
      </el-main>
    </el-container>
  </el-container>
</template>
<script>
import { main } from '@popperjs/core';
import store from "@/store";
export default{
name:main,

methods:{
  open(name){
    this.$router.push({name})
  },
  loginOut(){
    sessionStorage.clear();
this.$router.push('/login')
   window.location.reload()
  }
},

  created() {
    this.userName=sessionStorage.getItem('userName');
    this.$store.dispatch("GET_INFO");
  },
}
</script>
  
<style scoped>
.el-container {
  height: 100%;
}

.el-header {
  margin-bottom: 20px;
  background: #e9eef3;
}

.el-footer {
  line-height: 60px;
}

.el-aside {
  background-color: #191a22;
  color: var(--el-text-color-primary);
  text-align: center;
  line-height: 200px;
}

.el-main {
  background-color: #fcfcfc;
  color: var(--el-text-color-primary);
}
</style>